$(function () {
    let id
    // 1 发送请求获取文章列表数据 /admin/category/list
    function getCategoryList() {
        $.get('/admin/category/list', function (res) {
            let html = ''
            res.data.forEach(value => {
                html += `<option value="${value.id}">${value.name}</option>`

            })
            $('#category').html(html)
        })
    }
    // 2 初始化日期选择器
    function renderDate() {
        //执行一个laydate实例
        layui.laydate.render({
            elem: '#articleDate' //指定元素
        });
    }
    // 3 初始化文本编辑器
    function renderEditor() {
        tinymce.init({
            selector: '#articleContent',
            language: 'zh_CN',//注意大小写
        });
    }
    // 4 文件上传立即显现功能的实现
    $('#inputCover').change(function () {
        const file = this.files[0]
        $('#coverimg').prop('src', URL.createObjectURL(file))
    })
    // 5 发送请求 获取数据渲染表单组件
    function getArticleDetail() {
        const usp = new URLSearchParams(this.location.search);
        id = usp.get("id");
        // console.log(id)
        $.get('/admin/article/search', { id }, function (res) {
            // console.log(res)
            const { title, cover, categoryId, date, content } = res.data
            $("[name = 'title']").val(title)
            $('#coverimg').prop("src", cover)
            $("[name = 'categoryId]").val(categoryId)
            $("[name='date']").val(date)
            $("#articleContent").val(content)
        })
    }
    getCategoryList()
    renderDate()
    renderEditor()
    getArticleDetail()

    // 6 给发布按钮做点击事件
    $('.btn-edit').click(function () {
        postArticle('已发布')
    })
    // 7给草稿按钮做点击事件
    $('.btn-draft').click(function () {
        postArticle('')
    })


    function postArticle(state) {
        const fd = new FormData($('#form')[0])
        const content = tinyMCE.editors['articleContent'].getContent()
        fd.append('content', content)
        fd.append('state', state)
        fd.append('id', id)
        // fd.forEach((value, key) => console.log(value, key))
        $.ajax({
            url: '/admin/article/edit',
            type: 'post',
            data: fd,
            contentType: false,
            processData: false,
            success(res) {
                // console.log(res)
                if (res.code === 200) {
                    location.href = "article_list.html"
                }
            }
        })
    }
})